<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:p="http://primefaces.org/ui">

<h:head>
	<title>JSF 2.0 Hello World</title>
</h:head>
<h:body>
	<h:form id="form">  
		<h3>Consulta de Sucursal</h3>  
		<p:separator id="separator"/>
		<br></br>
		<p:panel header="Datos de la Sucursal" toggleSpeed="500" closeSpeed="500">
			<h:panelGrid columns="2">
				<h:outputText value="Sujeto:" style="font-weight:bold"/><h:outputText value="Sujeto xxxx" />
				<h:outputText value="Codigo de Sucursal: " style="font-weight:bold"/> <h:outputText value="99999-99" />
				<h:outputText value="Nombre del Responsable: " style="font-weight:bold"/> <h:outputText value="Gonzalo Fabian" /> 
				<h:outputText value="Apellido del Responsable:" style="font-weight:bold"/><h:outputText value="Copa" />  
				<h:outputText value="Apodo/Alias: " style="font-weight:bold"/> <h:outputText value="XXXXXXXXXXX XXXXXXXXXXXXXXXX XXXXXXXXXXXX" /> 
				<h:outputText value="Domicilio: " style="font-weight:bold"/> <h:outputText value="XXXXXXXXXXX XXXXXXXXXXXXXXXX 9999" />
			</h:panelGrid>  
			 
    	</p:panel>  
  		<p:panel header="Datos de Visita" toggleable="true" toggleSpeed="500" closeSpeed="500">  
			<h:panelGrid columns="2">
				<h:outputText value="Reparto: " style="font-weight:bold"/> <h:outputText value="XXXXX" /> 
				<h:outputText value="Dia de Visita:" style="font-weight:bold"/><h:outputText value="Lunes, Martes, Miercoles, Jueves, Viernes, Sabado" />
				<h:outputText value="Ultima Visita:" style="font-weight:bold"/><h:outputText value="99/99/9999" />
				<h:outputText value="Ultimo Consumo:" style="font-weight:bold"/><h:outputText value="99/99/9999" />  
			</h:panelGrid>  		
    	</p:panel>
    	<p:panel header="Detalles" toggleable="true" toggleSpeed="500" closeSpeed="500">  
			<p:tabView id="tabView">  
  				<p:tab title="Movimientos">  
			        <h:panelGrid  columns="5" cellpadding="10">  
			            <h:outputText value="Desde: " style="font-weight:bold"/> <p:calendar value="#{buscarSujeto.fechaDesde}"  readonlyInput="true"/> 
			            <h:outputText value="Hasta: " style="font-weight:bold"/> <p:calendar value="#{buscarSujeto.fechaHasta}" readonlyInput="true"/>  
			            <p:column><p:commandButton id="cmdBuscar" icon="ui-icon-search" actionListener="#{buscarSujeto.determinarFechas}" /> </p:column>  
			        </h:panelGrid>  
			        <p:separator/>
			        <p:dataTable id="dtbMovimiento" var="car" value="#{tableBean.carsSmall}">  
				        <f:facet name="header">  
							Movimientos  
				        </f:facet>  
				        <p:column>  
				            <f:facet name="header">  
				                Fecha 
				            </f:facet>  
				            <h:outputText value="#{car.model}" />  
				        </p:column>  
				        <p:column headerText="Producto">  
				            <h:outputText value="#{car.manufacturer}" />  
				        </p:column>  
				        <p:column headerText="Cantidad">  
				            <h:outputText value="#{car.color}" />  
				        </p:column>  
				        <p:column headerText="Tipo">  
				            <h:outputText value="#{car.year}" />  
				        </p:column>  
				    </p:dataTable>
			    </p:tab>  
			    
			    <p:tab title="Productos">  
			       <p:dataTable id="tblProductos" var="car" value="#{tableBean.carsSmall}">  
				        <f:facet name="header">  
							Productos asignados  
				        </f:facet>  
				        <p:column>  
				            <f:facet name="header">  
				                Codigo 
				            </f:facet>  
				  
				            <h:outputText value="#{car.model}" />  
				   
				        </p:column>  
				  
				        <p:column headerText="Nombre">  
				            <h:outputText value="#{car.manufacturer}" />  
				        </p:column>  
				    </p:dataTable>
			    </p:tab>  
			  
			    <p:tab title="Comercializacion" disabled="false">
			    	<h:panelGrid columns="2" >  
			        	<h:outputText value="Tipo de Comercializacion: " style="font-weight:bold"/> <h:outputText value="Mes Vencido" /> 
						<h:outputText value="Fecha de Inicio:" style="font-weight:bold"/><h:outputText value="99/99/999" /> 
			        </h:panelGrid>  
					<p:separator id="separator"/>
			        <p:dataTable id="dataTable" var="car" value="#{tableBean.carsSmall}">  
				  
				        <f:facet name="header">  
							Frio Calor asignados  
				        </f:facet>  
				  
				        <p:column>  
				            <f:facet name="header">  
				                Numero de Serie 
				            </f:facet>  
				  
				            <h:outputText value="#{car.model}" />  
				   
				        </p:column>  
				  
				        <p:column headerText="Marca">  
				            <h:outputText value="#{car.manufacturer}" />  
				        </p:column>  
				  
				        <p:column headerText="Modelo">  
				            <h:outputText value="#{car.color}" />  
				        </p:column>  
				  
				        <p:column headerText="Lugar">  
				            <h:outputText value="#{car.year}" />  
				        </p:column>  

				  
				    </p:dataTable>  
			    </p:tab>  
			  
			    
			  
			</p:tabView> 	
    	</p:panel>
</h:form>  
</h:body>
</html>